<template>
  <div class="main">
    <nav-bar class="home-nav">
      <div class="left" slot="left" @click="goBack"><van-icon name="arrow-left" size="24" /></div>
      <div slot="center">数据管理</div>
    </nav-bar>
    <div>
      <router-link  :to="{path:'/orign',query:{base_id:base_id,pid:pid, bid:bid,base_id:base_id}}">
      <div class="item_box">
        <div class="item_box_left">
        <img src="@/assets/images/Video-data.png" />
        <div class="item_text">
          <h2>视频管理</h2>
          <p>管理产品生长视频数据</p>
        </div>
        </div>
        <van-icon name="arrow" size="20" color="#ccc" />
      </div>
      </router-link>

      <router-link :to="{path:'/sensor_stage',query:{pid:pid, bid:bid,base_id:base_id}}">
      <div class="item_box">
        <div class="item_box_left">
        <img src="@/assets/images/Sensor-data.png" />
        <div class="item_text">
          <h2>传感器数据</h2>
          <p>管理产品生长传感器数据</p>
        </div>
        </div>
        <van-icon name="arrow" size="20" color="#ccc" />
      </div>
      </router-link>

      <router-link :to="{path:'/thirdParty',query:{pid:pid, bid:bid,base_id:base_id}}">
      <div class="item_box">
        <div class="item_box_left">
        <img src="@/assets/images/Third-party-data.png" />
        <div class="item_text">
          <h2>第三方数据</h2>
          <p>管理产品第三方数据数据</p>
        </div>
        </div>
        <van-icon name="arrow" size="20" color="#ccc" />
      </div>
      </router-link>

      <router-link :to="{path:'/elements',query:{pid:pid, bid:bid,base_id:base_id}}">
      <div class="item_box">
        <div class="item_box_left">
        <img src="@/assets/images/Nutrient-elements.png" />
        <div class="item_text">
          <h2>营养元素</h2>
          <p>管理产品营养元素</p>
        </div>
        </div>
        <van-icon name="arrow" size="20" color="#ccc" />
      </div>
      </router-link>

      <router-link :to="{path:'/qrcode',query:{pid:pid, bid:bid,base_id:base_id}}">
      <div class="item_box">
        <div class="item_box_left">
        <img src="@/assets/images/Traceability-source-management.png" />
        <div class="item_text">
          <h2>溯源码管理</h2>
          <p>管理产品溯源码生成</p>
        </div>
        </div>
        <van-icon name="arrow" size="20" color="#ccc" />
      </div>
      </router-link>

      <router-link :to="{path:'/printCode',query:{pid:pid, bid:bid,base_id:base_id}}">
      <div class="item_box">
        <div class="item_box_left">
        <img src="@/assets/images/Print-QR-code.png" />
        <div class="item_text">
          <h2>打印二维码</h2>
          <p>管理打印二维码</p>
        </div>
        </div>
        <van-icon name="arrow" size="20" color="#ccc" />
      </div>
      </router-link>

    </div>
  </div>
</template>

<script>
  import NavBar from "@/components/common/navbar/NavBar";
    export default {
        name: "index",
      components:{
        NavBar
      },

      data(){
          return {
            base_id:'',
            pid:'',
            bid:''
          }
      },

      created() {
        this.base_id = this.$route.query.base_id;
        this.pid = this.$route.query.pid;
        this.bid = this.$route.query.bid;
        console.log('pid',this.pid)
        console.log('bid',this.bid)
      },
      methods: {
        goBack(){
          this.$router.go(-1);
        },
      }
    }
</script>

<style scoped>

  .item_box{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 5px 4px 7px;
    margin: 15px 10px;
    background: #ffffff;
    border-radius: 8px;
  }
  .item_box_left{
    flex: 1;
  }
  .item_box img {
    float: left;
    width: 1rem;
    /*height: 1rem;*/
  }
  .item_box h2{
    font-size: .3rem;
    /*font-weight: normal;*/
  }
  .item_box p {
    font-size: .28rem;
  }
  .item_text{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    height: .8rem;
  }
</style>
